<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>

<style>
    .smart-form fieldset {
        padding: 0px 14px 5px;
    }
    .state-error input {
        background: #fff0f0;
        border-color: #A90329
    }

    .state-error em {
        display: block;
        margin-top: 6px;
        padding: 0 1px;
        font-style: normal;
        font-size: 11px;
        line-height: 15px;
        color: #D56161
    }

    .state-success input {
        background: #f0fff0;
        border-color: #7DC27D
    }

    .col-sm-6 input:hover {
        border-color: #5D98CC
    }
    .attributeError
    {
        color: #d56161;
        display: block;
        font-size: 11px;
        font-style: normal;
        line-height: 15px;
        margin-top: 6px;
        padding: 0 1px;
    }
</style>
<!-- row -->
<div class="row">
    <article class="col-sm-12 col-md-12 col-lg-12 sortable-grid ui-sortable">
        <!-- Widget ID (each widget will need unique ID)-->
        <div class="jarviswidget well" id="wid-id-3" data-widget-colorbutton="false" data-widget-editbutton="false"
             data-widget-togglebutton="false" data-widget-deletebutton="false"
             data-widget-fullscreenbutton="false" data-widget-custombutton="false" data-widget-sortable="false">
            <header>
            </header>
            <!-- widget div-->
            <!-- widget edit box -->
            <div class="jarviswidget-editbox">
                <!-- This area used as dropdown edit box -->
            </div>
            <!-- end widget edit box -->

            <!-- widget content -->
            <div class="widget-body">
                <div class="row">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                        <span class="font-md text-primary">
                            <spring:message code="DATAIMPORT_TITLE"/>
                        </span>
                    </div>
                </div>

                <hr class="simple">
                <div class="row" id="err_alert" style="display:none;">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                        <div class="alert alert-danger fade in"><spring:message code="DATAIMPORT_ERR_MSG"/></div>
                    </div>
                </div>
                <!--row-->
                <div class="row">

                    <form id="uploadForm" action="data/import" enctype="multipart/form-data" target="uploadf"
                          class="smart-form"
                          method="post">
                        <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
                            <fieldset>
                                <label class="input hidden">
                                    <%--<i class="icon-append fa fa-user"></i>--%>
                                    <input type="text" id= "testFileUUID" name="testFileUUID">
                                </label>
                                <section>
                                    <div class="form-group">
                                        <%--<label class="label">File input</label>--%>

                                        <div class="input input-file">
                                        <span class="button">
                                            <input type="file" id="file" name="file"
                                                   onchange="this.parentNode.nextSibling.value = this.value"><spring:message
                                                code='GLOBAL_BUTTON_BROWSE'/></span><input type="text" id="filePath"
                                                                                           placeholder="<spring:message code='DATAIMPORT_BROWSE_PLACEHOLDER'/>"
                                                                                           readonly="">
                                        </div>
                                    </div>
                                    <div class="note">
                                        <%--<strong></strong>--%>
                                        <%--File size less then 256m.--%>
                                    </div>
                                </section>

                                <section>
                                    <div class="form-group">
                                        <%--<label class="label">Project</label>--%>
                                        <input type="text" style="width:100%" id="sproject" name="projectId"
                                               placeholder="<spring:message code='DATAIMPORT_PROJECT_PLACEHOLDER'/>">
                                    </div>
                                </section>
                                <a href="javascript:void(0);" id="btn_submit" class="btn btn-primary" data-loading-text="<i class='fa fa-refresh fa-spin'></i> <spring:message code='DATAIMPORT_START'/>"><spring:message
                                        code='DATAIMPORT_START'/></a>

                            </fieldset>
                        </div>
                    </form>
                    <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
                        <blockquote>
                            <p>
                                <spring:message code='DATAIMPORT_DETAIL'/>
                            </p>
                            <small><spring:message code='DATAIMPORT_DETAIL_SUBTITLE'/></small>

                        </blockquote>
                        <a href="#data/history" class="pull-right"> <spring:message code="DATAIMPORT_HISTORY"/> </a>
                    </div>
                </div>
                <div class="row">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                        <%--<form action="#" class="dropzone" id="mydropzone"></form>--%>
                        <ul id="dataImportTab" class="nav nav-tabs">
                            <li class="active">
                                <a href="#pcAttribute" data-toggle="tab">
                                    <spring:message code="ATTRIBUTE_PROJECT_ATTRIBUTE"/>
                                </a>
                            </li>
                            <li><a href="#log" data-toggle="tab"><spring:message code="ATTRIBUTE_IMPORT_LOG"/></a></li>
                        </ul>
                        <div id="pcAttributeTabContent" class="tab-content">

                            <div class="tab-pane fade in active" id="pcAttribute">
                                <div class="well">

                                    <h4 class="alert alert-warning">
                                        <spring:message code="PROJECT_COLUMN_TITLE"/>
                                    </h4>
                                    <div id="m_dialog_alert" class="alert alert-warning margin-bottom-10 fade in" style="display:none; margin-bottom:10px;"></div>
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="input-group">
                                                <input class="form-control" type="text" id="attributeId" name="search_LIKE_attribute" maxlength="<spring:message code='GLOBAL_FIELD_MAX'/>" onclick="clearContent(this);"
                                                       placeholder="<spring:message code='PROJECT_COLUMN'/>">
                                                <div class="input-group-btn">
                                                    <button id="attributeSubmit" type="button" class="btn btn-default btn-primary">
                                                        <i class="fa fa-submit "></i> <spring:message code='GLOBAL_BUTTON_ADD'/>
                                                    </button>
                                                </div>
                                            </div>
                                            <label id="add-label" class="attributeError"></label>
                                        </div>
                                    </div>

                                    <!-- /.modal -->

                                    <table id="dt_cpw" class="table table-bordered table-hover" width="100%">
                                        <thead>
                                        <tr>
                                            <th width="15%"><spring:message code="TABLE_NO"/></th>
                                            <th width="15%"><spring:message code="PROJECT_COLUMN_NAME"/></th>
                                            <th width="20%"><spring:message code="PROJECT_COLUMN_VALUE"/></th>
                                            <th width="20%"><spring:message code="PROJECT_COLUMN_DEFLAUT"/></th>
                                            <th width="15%"><spring:message code="GLOBAL_OPERATE"/></th>
                                            <th width="15%"><spring:message code="PROJECT_COLUMN_SHOW"/></th>
                                        </tr>
                                        </thead>
                                        <tbody></tbody>
                                    </table>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="log">

                                <div class="well">
                                    <span id="p_operator"><spring:message code='DATAIMPORT_ON_DEFAULT'/></span>

                                    <div class="progress progress-xs">
                                        <div id="processbar" role="progressbar" aria-valuenow="0" aria-valuemin="0"
                                             aria-valuemax="100"
                                             style="width: 0%;" class="progress-bar"></div>
                                    </div>
                                    <div>
                                        <spring:message code='DATAIMPORT_STATUS'/> <span id="p_status"></span>
                                    </div>
                                    <div>
                                        <spring:message code='DATAIMPORT_TIME'/> <span id="p_time"></span>
                                    </div>
                                    <br>
                                    <spring:message code='DATAIMPORT_LOG'/>
                                    <div class="well well-light well-clean" id="p_logArea"
                                         style="height:400px;overflow: auto;">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <!--end row-->
            </div>
            <!-- end widget content -->
        </div>
        <!-- end widget div -->
        <!-- end widget -->
    </article>
    <iframe name="uploadf" style="display:none"></iframe>
</div>
<!-- end row -->

<script src="js/core/business/dataimport/dataImportInit.js"></script>
<script type="text/javascript">
    //    appendBreadCrumb("data/import", "Data Import");
    function clearContent(txt) {
        txt.value = "";
    }
</script>
